<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<base href="<%=basePath%>">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="renderer" content="webkit" />
	<title>电子商务</title>
	<link rel="stylesheet" href="css/bootstrap.min.css" />
	<link rel="stylesheet" href="css/select.css" />
	<link rel="stylesheet" href="css/style.css" />
	<link rel="stylesheet" href="css/login.css" />
	<link rel="stylesheet" href="css/jquery.ui.css" />
	<link rel="stylesheet" href="css/jquery.slider.css" />
	<script src="js/jquery.min.js"></script>
	<script src="js/jquery.slider.min.js"></script>
	<script type="text/javascript">
	var validateslider=false;
$(function(){
	
	$("#slider1").slider({
		callback: function(result) {
			validateslider=result;
		}
	});
	$("#username").focus();
	document.onkeydown = function(e){
	    var ev = document.all ? window.event : e;
	    if(ev.keyCode==13) {
	    	login();
	     }
	}
	
});   
function login(){
	//${webRoot}/datauser/login
  	if(!validateslider){
  		alert("请完成拖动验证");
  		return;
  	}
	var dataRequest = {
			"userName" : $("#userName").val(),
			"password" : $("#password").val(),
			"fresh" : Math.random()
			};
 	$.ajax({
		type : "POST",
		url : "<%=path%>"+"/view/login/Validate",
		dataType : "json",
		async : false,
		data : dataRequest,
		success : function(rst) {
			if(rst!=""){
				window.location.href="<%=path%>"+rst;
			}else{
				alert("用户名或密码错误！");
			}
		},
		error : function(e) {
			return 'error';
		}
	});
	
 
}
function myrefresh(){
 var url = "DataCenterMVC/index";
 window.location.replace(url);
}
</script>
</head>
<body>
	<div class="login_top">
		<div class="title">
			<p class="main_title" style="font-weight: bolder;font-size:40px">电子商务</p>
			<p class="sub_title"></p>
		</div>
	</div>
	<div class="login_mid">
		<div class="login_mid_inner">
			<div class="login_box">
				<h4>登录</h4>
				<form role="form" class="content">
					<div class="form-group">
						<label>账号：</label>
						<input type="text" class="form-control" placeholder="请输入登录账号" id="userName" />
					</div>
					<div class="form-group">
						<label>密码：</label>
						<input type="password" class="form-control" placeholder="请输入密码" id="password"/>
					</div>
					<div class="form-group">
						<div id="slider1" class="slider"></div>
					</div>
					
					<div class="form-group yanzheng" style="display:none">
						<label>验证码：</label>
						<input type="text" class="form-control" placeholder="请输入验证码" />
						<img class="vertify" alt="验证码图片" />
						<a class="vertify_btn" href="javascript:void(0)">刷新</a>
					</div>
					<div class="form-group">
						<a href="javascript:void(0)" class="login_btn btn btn-default" onclick="login()">立即登录</a>
					</div>
					<div class="form-group check" style="display:none">
						<input type="checkbox" class="checkbox" />
						<i></i>
						<span>自动登录</span>
					</div>
				</form>
			</div>
		</div>
	</div>
	<div class="login_foot">
	
	</div>
</body>
</html>